<template>
	<div class="left-one">
		<div class="titleS">线上订单总数</div>
		<ul class="num-wrap">
			<li class="num-list" v-for="item in onlineOrderTotal" :key="item">{{item}}</li>
		</ul>
		<div class="titleS">线上销售交易总额</div>
		<ul class="num-wrap">
			<li class="num-list" v-for="item in onlineSaleTotal" :key="item">{{item}}</li>
		</ul>
	</div>
</template>

<script>
export default {
	name: 'left-one',
	props: {
		onlineSaleTotal: {
			type: String,
			default: ''
		},
		onlineOrderTotal: {
			type: String,
			default: ''
		}
	}
}
</script>

<style scoped lang="less">
.left-one {
	width: 100%;
	height: 100%;
	.titleS {
		font-size: 24px;
		font-weight: 400;
		line-height: 31px;
		color: rgba(255, 255, 255, 1);
		margin-top: 10px;
	}
	.num-wrap {
		display: flex;
		justify-content: flex-start;
		margin-top: 15px;
		.num-list {
			width: 48px;
			height: 60px;
			border-radius: 6px;
			border: 1px solid rgba(112, 112, 112, 1);
			margin-right: 2%;
			text-align: center;
			line-height: 60px;
			border: 1px solid #21b5e3;
			box-sizing: border-box;
			color: white;
			font-size: 40px;
		}
	}
}
</style>
